body{
    background-image: url(./img/background.jpeg);
    background-repeat: no-repeat;
    background-size:100% 100%;
    background-attachment: fixed;
}
.topnav{
    background-color: rgb(144, 238, 144,0.3);
    width: 100%;
    overflow: hidden;
    border-bottom-style: solid;
    border-bottom-color: gray;
}
.topnav a{
    float:left;
    width: 10%;
    display: block;
    color: black;
    text-align: center;
    font-size: larger;
    padding: 10px;
    text-decoration: none;
}
.topnav a:hover{
    text-decoration: underline;
}
.header{
    padding: 50px;
    height: 200px;
    width: 100%;
    text-align: center;
    font-style: italic;
    color: gold;
    font-size: x-large;
}
.blog{
    overflow: hidden;
    border-style: ridge;
    border-color:azure;
    width: 75vw;
    background-color: rgb(240, 255, 255,0.5);
    margin: 0 auto;
}
.blog img{
    width: 30%;
    height: auto;
    float: left;
}
h1{
    text-align: center;
    text-decoration: none;
}
.blog a{
    color:sandybrown;
    text-decoration: none;
}
.blog a:hover{
    text-decoration: underline;
}
.blog p{
    font-size: large;
    text-align: center;
    color:black;
}
.content{
    width: 75%;
    background-color: rgb(240, 248, 255,0.6);
    margin: 0 auto;
}
.content p{
    text-align: center;
    padding: 20px;
}
.content img{
    height: auto;
    margin: 0 auto;
}
.archive{
    width:75%;
    background-color: rgb(245, 245, 220,0.6);
    margin: 0 auto;
}
.archive h1{
    font-size: small;
    color: gray;
}
.archive a{
    display: block;
    color:black;
    text-decoration: none;
    text-align: center;
    font-size: xx-large;
}
.archive a:hover{
    text-decoration: underline;
}
.gallery{
    border-style:groove;
    border-width: 12px;
    width:90%;
    height: auto;
    margin: 0 auto;
    background-color:rgb(240, 255, 255,0.4);
    overflow: hidden;
}
.photo{
    width: 50%;
    height: auto;
    float: left;
    text-align: center;
    font-size: x-large;
}
.photo img{
    width:100%;
    height:auto;
}